import React, { Component } from "react";
import PropTypes from "prop-types";
import cx from "classnames";

import Icon from "../../components/Icon/index";

export default class GroupHeader extends Component {
  constructor(props) {
    super(props);
  }
  render() {
    const { title, desc, onClick } = this.props;

    return (
      <div>
        <div className="growth-group-header" onClick={onClick}>
          <div
            className="growth-group-border"
          >
            <span className="growth-group-border-title">{title}</span>
          </div>
          {onClick && (
            <a className="growth-group-header-link">
              <Icon type="right" />
            </a>
          )}

          <div className="growth-group-desc">{desc}</div>
        </div>
      </div>
    );
  }
}

GroupHeader.propTypes = {
  title: PropTypes.string,
  color: PropTypes.string,
  desc: PropTypes.string,
  icon: PropTypes.any,
  onClick: PropTypes.func
};
